import React, { Component, Suspense } from "react";
import { Link } from "react-router-dom";
import { renderRoutes } from "../../router/routes";

class Product extends Component {
	render() {
		const {
			routes = []
		} = this.props;
		console.log(this.props);

		return (
			<div className="product-container">
				<h2>Product</h2>
				<ul>
					<li>
						<Link to="/product/list">list</Link>
					</li>
					<li>
						<Link to="/product/detail">detail</Link>
					</li>
				</ul>
				<Suspense fallback={<div>Loading...</div>}>
					{renderRoutes(routes)}
				</Suspense>
			</div>
		);
	}
}

export default Product;
